<script setup lang="ts">
import { showToast } from "vant";
import { useRouter } from 'vue-router';
const router=useRouter()
const onClickLeft=()=>{
  router.push('/wys')
}
</script>

<template>
  <van-nav-bar title="复诊开方申请" left-arrow @click-left="onClickLeft">
    <template #right>
      <van-icon name="weapp-nav" size="18" />
    </template>
  </van-nav-bar>

  <div class="yxyf">
    <div class="top">
      <img src="../6.png" alt="" />
      <div>优选药房，健康常伴</div>
    </div>

    <ul>
      <li class="active">全部商品</li>
      <li>新品</li>
      <li>销量</li>
      <li>价格</li>
      <li class="search"><van-icon name="search" />搜索</li>
    </ul>

    <van-floating-bubble style="width: 170px; height: 40px;font-size: 0.3rem;border-radius: 0%;border-top-left-radius:20px;border-bottom-left-radius:20px; ">我的购物车<van-icon style="margin-left: 10px;" name="shopping-cart-o" /></van-floating-bubble>

  </div>
</template>

<style scoped lang="scss">
.yxyf {
  width: 100%;
  height: 93%;
  font-size: 0.35rem;
  background-color: #f2f2f2;

  .top {
    width: 100%;
    height: 80px;
    display: flex;
    background-color: rgb(0, 128, 255);
    align-items: center;
    padding-left: 15px;
    

    img {
      width: 50px;
      height: 50px;
      border-radius: 10px;
      margin-right: 10px;
    }

    div {
      color: #fff;
      font-weight: bolder;
    }
  }

  ul {
    width: 100%;
    height: 50px;
    display: flex;
    font-size: 0.3rem;
    align-items: center;

    li {
      height: 30px;
      width: 20%;
      text-align: center;
      line-height: 30px;
    }

    .search {
      border-radius: 15px;
      background-color: #fff;
      color: #b0b0b0;
    }

    .active {
      color: rgb(0, 128, 255);
    }
  }
}
</style>
